<template>
  <div class="form-preview-quality-rule">
    <div class="form-preview-group">
      <label>{{label1}}</label>
    </div>
    <div class="form-preview-group">
      <label>{{label2}}</label>
    </div>
    <div class="form-preview-group">
      <label>{{label3}}</label>
    </div>
  </div>
</template>

<script>
import { previewProps } from '@src/component/form/components/props';
import translate from '@src/component/form/mixin/translate.js'
import { transformI18n } from '@src/locales'

export default {
  name: 'form-quality-preview',
  mixins: [translate],
  props: previewProps,
  computed:{
    label1(){
      return transformI18n('common.form.preview.qualityField.label1', this.formPreviewLocale)
    },
    label2(){
      return transformI18n('common.form.preview.qualityField.label2', this.formPreviewLocale)
    },
    label3(){
      return transformI18n('common.form.preview.qualityField.label3', this.formPreviewLocale)
    }
  }
}
</script>
<style lang="scss" scoped>
.quality-rule {
  background: $color-primary-light-1;
  color: $color-primary-light-6;
}
</style>